<template>
  <el-card class="box-card" style="margin: 40px;">
    <div slot="header" class="clearfix">
      <span style="font-weight: bold; font-size: 20px;">审批意见</span>
    </div>
    <div class="text item">
      <el-table
        ref="multipleTable"
        :data="commentList"
        :span-method="objectSpanMethod"
        border
        height="300"
        tooltip-effect="dark"
        style="width: 100%; margin-top: 20px;">
        <el-table-column
          type="index"
          label="序号"
          width="55"
          align="center"
          sortable>
        </el-table-column>
        <el-table-column
          prop="name"
          align="center"
          label="节点名称">
        </el-table-column>
        <el-table-column
          prop="user"
          align="center"
          label="处理人">
        </el-table-column>
        <el-table-column
          prop="handler"
          align="center"
          label="处理方式"
          width="160">
        </el-table-column>
        <el-table-column label="结束时间" align="center" prop="endTime" width="160">
          <template slot-scope="scope">
            <span>{{ parseTime(scope.row.endTime) }}</span>
          </template>
        </el-table-column>
        <el-table-column
          prop="resolution"
          align="center"
          label="处理意见">
        </el-table-column>
      </el-table>
    </div>
  </el-card>
</template>

<script>
import {getProcessComment} from "@/api/camunda/camunda";

export default {
  name: "comment",
  props: {
    processInstanceId: {
      type: String
    }
  },
  data() {
    return {
      commentList: [],
      spanAttr: []
    }
  },
  created() {
    this.init()
  },
  methods: {
    init(){
      getProcessComment(this.$props.processInstanceId)
        .then(({data}) => {
          this.spanAttr = []
          let pos = 0
          for (let i = 0; i < data.length; i++) {
            if (i === 0) {
              this.spanAttr.push(1);
            } else {
              // 判断当前元素与上一个元素是否相同
              if (data[i].name === data[i - 1].name) {
                this.spanAttr[pos] += 1;
                this.spanAttr.push(0);
              } else {
                this.spanAttr.push(1);
                pos = i;
              }
            }
          }
          this.commentList = data
        })
    },
    objectSpanMethod({ row, column, rowIndex, columnIndex }) {
      if (column.label === '节点名称') {
        const _row = this.spanAttr[rowIndex];
        const _col = _row > 0 ? 1 : 0;
        return {
          rowspan: _row,
          colspan: _col
        }
      }
    }
  }
}
</script>

<style scoped>

</style>
